{extend name="top/index" /}
{block name="main"}
	<!-- END SIDEBAR -->
	<!-- BEGIN CONTENT -->
<link href="/static/assets/css/toastr.min.css" rel="stylesheet"/>
	
	<div class="page-content-wrapper">
		<div class="page-content">
			<!-- BEGIN SAMPLE PORTLET CONFIGURATION MODAL FORM-->
			<div class="modal fade" id="portlet-config" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
				<div class="modal-dialog">
					<div class="modal-content">
						<div class="modal-header">
							<button type="button" class="close" data-dismiss="modal" aria-hidden="true"></button>
							<h4 class="modal-title">Modal title</h4>
						</div>
						<div class="modal-body">
							 Widget settings form goes here
						</div>
						<div class="modal-footer">
							<button type="button" class="btn blue">Save changes</button>
							<button type="button" class="btn default" data-dismiss="modal">Close</button>
						</div>
					</div>
					<!-- /.modal-content -->
				</div>
				<!-- /.modal-dialog -->
			</div>
			<!-- /.modal -->
			<!-- END SAMPLE PORTLET CONFIGURATION MODAL FORM-->
			<!-- BEGIN STYLE CUSTOMIZER -->
			<div class="theme-panel hidden-xs hidden-sm">
				<!-- <div class="toggler">
				</div> -->
				<div class="toggler-close">
				</div>
				<div class="theme-options">
					<div class="theme-option theme-colors clearfix">
						<span>
							 THEME COLOR
						</span>
						<ul>
							<li class="color-black current color-default" data-style="default">
							</li>
							<li class="color-blue" data-style="blue">
							</li>
							<li class="color-brown" data-style="brown">
							</li>
							<li class="color-purple" data-style="purple">
							</li>
							<li class="color-grey" data-style="grey">
							</li>
							<li class="color-white color-light" data-style="light">
							</li>
						</ul>
					</div>
					<div class="theme-option">
						<span>
							 Layout
						</span>
						<select class="layout-option form-control input-small">
							<option value="fluid" selected="selected">Fluid</option>
							<option value="boxed">Boxed</option>
						</select>
					</div>
					<div class="theme-option">
						<span>
							 Header
						</span>
						<select class="header-option form-control input-small">
							<option value="fixed" selected="selected">Fixed</option>
							<option value="default">Default</option>
						</select>
					</div>
					<div class="theme-option">
						<span>
							 Sidebar
						</span>
						<select class="sidebar-option form-control input-small">
							<option value="fixed">Fixed</option>
							<option value="default" selected="selected">Default</option>
						</select>
					</div>
					<div class="theme-option">
						<span>
							 Sidebar Position
						</span>
						<select class="sidebar-pos-option form-control input-small">
							<option value="left" selected="selected">Left</option>
							<option value="right">Right</option>
						</select>
					</div>
					<div class="theme-option">
						<span>
							 Footer
						</span>
						<select class="footer-option form-control input-small">
							<option value="fixed">Fixed</option>
							<option value="default" selected="selected">Default</option>
						</select>
					</div>
				</div>
			</div>
			<!-- END STYLE CUSTOMIZER -->
			<!-- BEGIN PAGE HEADER-->
			<div class="row">
				<div class="col-md-12">
					<!-- BEGIN PAGE TITLE & BREADCRUMB-->
					<h3 class="page-title">
					账户管理
					</h3>
					<ul class="page-breadcrumb breadcrumb">
						<li class="btn-group">
							
						</li>
						<li>
							<i class="fa fa-home"></i>
							<a href="{:url('index/index/index')}">
								Home
							</a>
							<i class="fa fa-angle-right"></i>
						</li>
						<li>
							<a href="{:url('index/manage/index')}">
								账户管理
							</a>
							<i class="fa fa-angle-right"></i>
						</li>
					</ul>
					<!-- END PAGE TITLE & BREADCRUMB-->
				</div>
			</div>
			
			<!-- END PAGE HEADER-->
			<!-- BEGIN PAGE CONTENT-->
			<div class="row">
				<div class="col-md-12">
					<!-- Begin: life time stats -->
					<div class="portlet">
						<div class="portlet-title">
							<div class="caption">
								<i class="fa fa-gift"></i>账户管理
							</div>
							
						</div>
						<div class="portlet-body">
							<ul>
								<li style="float: left;list-style: none;height: 30px;">
								<div style="border: 1px solid #D4D4D4; background-color: #F2F2F2;cursor: pointer;width: 100px;text-align: center;line-height: 30px;" onclick="ry()"><p>人员</p></div>
								</li>
								<li style="float: left;list-style: none;">
								<div style="border: 1px solid #D4D4D4;background-color: #F2F2F2;cursor: pointer;width: 100px;text-align: center;line-height: 30px;" onclick="bm()"><p>子部门</p></div>
								</li>
								<li style="float: left;list-style: none;">
								<div style="border: 1px solid #D4D4D4;background-color: #F2F2F2;cursor: pointer;width: 100px;text-align: center;line-height: 30px;" onclick="sq()"><p>授权</p></div>
								</li>
							</ul>
							
							<div class="portlet blue box" style="display: block;width: 30%;float: left;">
										<div class="portlet-title">
											<div class="caption">
												<i class="fa fa-cogs"></i>Default Tree
											</div>
											<div class="tools">
												<a href="javascript:;" class="reload">
												</a>
											</div>
										</div>
										<div class="portlet-body">
											<div id="tree_1" class="tree-demo">
												<ul>
													<li>
														 Root node 1
														<ul>
															<li data-jstree='{ "selected" : true }'>
																<a href="#">
																	 Initially selected
																</a>
															</li>
															<li data-jstree='{ "icon" : "fa fa-briefcase icon-success " }'>
																 custom icon URL
															</li>
															<li data-jstree='{ "opened" : true }'>
																 initially open
																<ul>
																	<li data-jstree='{ "disabled" : true }'>
																		 Disabled Node
																	</li>
																	<li data-jstree='{ "type" : "file" }'>
																		 Another node
																	</li>
																</ul>
															</li>
															<li data-jstree='{ "icon" : "fa fa-warning icon-danger" }'>
																 Custom icon class (bootstrap)
															</li>
														</ul>
													</li>
													<li data-jstree='{ "type" : "file" }'>
														<a href="http://www.jstree.com">
															 Root node 2
														</a>
													</li>
												</ul>
											</div>
										</div>
							</div>
							<div class="table-container">
								<div class="tab" id="t1" style="display: inline;">
									<div  style="float: right;"> 
									<a href="{:url('ryadd')}" class="btn btn-primary btn">+人员</a>
									</div>	
									<div class="col-md-6" style="float: left;width: 30%;">
									</div>
									<table class="table table-striped table-bordered table-hover" style="width: 70%;float: right;">
									<thead>
									<tr role="row" class="heading">
										<th width="1%">
											<input type="checkbox" class="group-checkable">
										</th>
										<th width="20%">
											 登录名
										</th>
										
										<th width="20%">
											 组织单位(部门)
										</th>
										<th width="20%">
											 组
										</th>
										<th width="20%">
											操作
										</th>
									</tr>
									{if empty($renyuan)} 
									<tr role="row" class="filter">
										<td>
											<input type="checkbox" class="group-checkable">
										</td>
										<td colspan="4">没有人员信息</td>
									</tr>
									{else /}
									{volist name="renyuan" id="aa"}
									<tr role="row" class="filter">
										<td>
											<input type="checkbox" class="group-checkable">
										</td>
										<td>
											{$aa.user_name}
										</td>
										<td>
											{$aa.org_name}
										</td>
										<td>
											{$aa.chara_name}
										</td>
										<td>
											<a href="{:url('ryedit',['id'=>$aa['user_id']])}" class="btn btn-warning btn">编辑</a>
											<a href="{:url('rydel',['id'=>$aa['user_id']])}" class="btn btn-danger btn ">删除</a>
										</td>
									</tr>
									{/volist}
									{/if}
									
									</thead>
									<tbody>
									</tbody>
									</table>
									
									</div>

								</div>
								<div class="tab" id="t2" style="display: none;">
									<div  style="float: right;">
									<a href="{:url('bmadd')}" class="btn btn-primary btn">+部门</a>
									</div>	
									<div class="col-md-6" style="float: left;width: 30%;">
									
								</div>

									<table class="table table-striped table-bordered table-hover" style="width: 70%;float: right;">
									<thead>
									<tr role="row" class="heading">
										<!-- <th width="1%">
											<input type="checkbox" class="group-checkable">
										</th> -->
										<th width="20%">
											 类别
										</th>
										<th width="20%">
											 名称
										</th>
										<th width="20%">
											 人数
										</th>
										<th width="20%">
											 操作
										</th>
									</tr>
									{if empty($bumen)} 
									<tr role="row" class="filter">
										
										<td colspan="4">没有部门信息</td>
									</tr>
									{else /}
									{volist name="bumen" id="vo"}
									<tr role="row" class="filter">
										<!-- <td>
											<input type="checkbox" class="group-checkable" id="{$vo.org_id}">
										</td> -->
											{if condition="($vo.org_type == 0)"} <td>组织单位</td>
								            {elseif condition="$vo.org_type eq 1"/}<td>下属单位</td>
								            {elseif condition="$vo.org_type eq 2"/}<td>分支机构</td>
								            {elseif condition="$vo.org_type eq 3"/}<td>公司</td>
								            {/if}
										<td>
											<a style="text-decoration: none;" href="{:url('sonindex',['id'=>$vo['org_id']])}">{$vo.org_name}</a>
										</td>
										<td>
											{$vo.count}
										</td>
										<td>
											<!-- <button class="btn btn-danger btn del-btn" data-id="">编辑</button> -->
											<a href="{:url('bmedit',['id'=>$vo['org_id']])}" class="btn btn-primary btn">编辑</a>
											<!-- <a href="{:url('bmdel',['id'=>$vo['org_id']])}" class="btn btn-warning btn">删除</a> -->
											<button class="btn btn-danger" data-href="{:url('bmdel',['id'=>$vo['org_id']])}" data-toggle="modal" data-target="#confirm-delete">
											删除记录 
											</button>
										</td>
									</tr>
									{/volist}
									{/if}
									</thead>
									<tbody>
									</tbody>
									</table>

								</div>
								<!-- 删除部门的模态框 -->
									<div class="modal fade" id="confirm-delete" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
									<div class="modal-dialog">
									<div class="modal-content">
									<div class="modal-header">
									请确认
									</div>
									<div class="modal-body">
									确认删除该部门吗？
									</div>
									<div class="modal-footer">
									<button type="button" class="btn btn-primary" data-dismiss="modal">取消</button>
									<a class="btn btn-danger btn-ok">删除部门</a>
									</div>
									</div>
									</div>
									</div>
									
									<script>
										$('#confirm-delete').on('show.bs.modal', function(e) {
										$(this).find('.btn-ok').attr('href', $(e.relatedTarget).data('href'));
										});
									</script>
								<!--  -->
								<div class="tab" id="t3"  style="display: none;">
									<div  style="float: right;">
									<button class="btn btn-primary btn-lg " data-toggle="modal" data-target="#myModal">
										+授权
									</button>
									<!-- 模态框（Modal） -->
									<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
										<div class="modal-dialog">
											<div class="modal-content">
												<div class="modal-header">
													<button type="button" class="close" data-dismiss="modal" aria-hidden="true">
														&times;
													</button>
													<h4 class="modal-title" id="myModalLabel">
														授权
													</h4>
												</div>
												
												<div class="modal-body">

													<div class="form-group">
													    <label class="col-sm-2 control-label">角色:</label>
														   <select class="form-control-static col-sm-10" name="cha" id="cha">
															{volist name='cha' id='char'}
															<option> {$char}</option>
															{/volist}
															</select>
													</div>
													<br>
													<div class="form-group">
													    <label class="col-sm-2 control-label">人员:</label>
														   <select class="form-control-static col-sm-10" name="use" id="use">
														   	{volist name='use' id='user'}
															<option> {$user}</option>
															{/volist}
															</select>
													</div>
												</div>
												<div class="modal-footer">
													<button type="button" class="btn btn-warning close-btn" data-dismiss="modal">关闭
													</button>
														<input type="submit" class="btn btn-primary sub-btn" value="授权"/>
												</div>
											</div><!-- /.modal-content -->
										</div><!-- /.modal -->
									</div>
									</div>	
									<div class="col-md-6" style="float: left;width: 30%;">
									
									</div>
									<table class="table table-striped table-bordered table-hover " style="width: 70%;float: right;">
									<thead>
									<tr role="row" class="heading">
										
										<th width="50%">
											角色
										</th>
										<th width="50%">
											人员
										</th>
									</tr>
										{volist name="all" id="vo"}
									<tr role="row" class="filter">
										<td>{$vo.chara_name}</td>
										<td>{$vo.user_name}</td>
										{/volist}
									</tr>
									</thead>
									<tbody>
									</tbody>
									</table>
								</div>
							</div>
						</div>
					</div>
					<!-- End: life time stats -->
				</div>
			</div>

			<!-- END PAGE CONTENT-->
		</div>
	</div>
	<!-- END CONTENT -->
</div>
<!-- END CONTAINER -->
<!-- BEGIN FOOTER -->
<div class="footer">
	<div class="footer-inner">
		 2014 &copy; Metronic by keenthemes.
	</div>
	<div class="footer-tools">
		<span class="go-top">
			<i class="fa fa-angle-up"></i>
		</span>
	</div>
</div>
<!-- END FOOTER -->
<!-- BEGIN JAVASCRIPTS(Load javascripts at bottom, this will reduce page load time) -->
<!-- BEGIN CORE PLUGINS -->
<!--[if lt IE 9]>
    <script src="assets/plugins/respond.min.js"></script>
    <script src="assets/plugins/excanvas.min.js"></script> 
    <![endif]-->
<!-- <script src="assets/plugins/jquery-1.10.2.min.js" type="text/javascript"></script>
<script src="assets/plugins/jquery-migrate-1.2.1.min.js" type="text/javascript"></script> -->
<!-- IMPORTANT! Load jquery-ui-1.10.3.custom.min.js before bootstrap.min.js to fix bootstrap tooltip conflict with jquery ui tooltip -->
<!-- <script src="assets/plugins/jquery-ui/jquery-ui-1.10.3.custom.min.js" type="text/javascript"></script>
<script src="assets/plugins/bootstrap/js/bootstrap.min.js" type="text/javascript"></script>
<script src="assets/plugins/bootstrap-hover-dropdown/bootstrap-hover-dropdown.min.js" type="text/javascript"></script>
<script src="assets/plugins/jquery-slimscroll/jquery.slimscroll.min.js" type="text/javascript"></script>
<script src="assets/plugins/jquery.blockui.min.js" type="text/javascript"></script>
<script src="assets/plugins/jquery.cokie.min.js" type="text/javascript"></script>
<script src="assets/plugins/uniform/jquery.uniform.min.js" type="text/javascript"></script> -->
<!-- END CORE PLUGINS -->
<!-- BEGIN PAGE LEVEL PLUGINS -->
<!-- <script type="text/javascript" src="assets/plugins/select2/select2.min.js"></script>
<script type="text/javascript" src="assets/plugins/data-tables/jquery.dataTables.js"></script>
<script type="text/javascript" src="assets/plugins/data-tables/DT_bootstrap.js"></script>
<script type="text/javascript" src="assets/plugins/bootstrap-datepicker/js/bootstrap-datepicker.js"></script> -->
<!-- END PAGE LEVEL PLUGINS -->
<!-- BEGIN PAGE LEVEL SCRIPTS -->
<script src="/static/assets/plugins/jstree/dist/jstree.min.js"></script>
<script src="/static/assets/scripts/custom/ui-tree.js"></script>
<script src="/static/assets/scripts/core/app.js"></script>
<link rel="stylesheet" type="text/css" href="/static/assets/plugins/jstree/dist/themes/default/style.min.css"/>
<script src="/static/assets/scripts/core/dt.js"></script>
<script src="/static/assets/js/toastr.min.js" rel="stylesheet"/></script>
<!-- <script src="assets/scripts/core/datatable.js"></script>
<script src="assets/scripts/custom/ecommerce-products.js"></script> -->
<!-- END PAGE LEVEL SCRIPTS -->
<script>
        jQuery(document).ready(function() {    
           App.init();
           UITree.init();
        });
    </script>
<!-- END JAVASCRIPTS -->
<script>
	function ry()
	{
        $("#t1").css("display","inline");
        $("#t2").css("display","none");
        $("#t3").css("display","none");
	}
	function bm()
	{
        $("#t2").css("display","inline");
        $("#t1").css("display","none");
        $("#t3").css("display","none");
	}
	function sq()
	{
        $("#t3").css("display","inline");
        $("#t1").css("display","none");
        $("#t2").css("display","none");
	}
</script>

<script type="text/javascript">
  // 获取cha use的值
  $(function(){
    $('.sub-btn').click(function () {
      // console.log($('#score').attr( "value"))
      postdata();
    });

     function postdata(){     
         //提交数据函数   
        toastr.options = {  
            closeButton: true,  
            debug: false,  
            progressBar: true,  
            positionClass: "toast-top-right",  
            onclick: null,  
            showDuration: "1000",  
            hideDuration: "1000",  
            timeOut: "1000",  
            extendedTimeOut: "1000",  
            showEasing: "swing",  
            hideEasing: "linear",  
            showMethod: "fadeIn",  
            hideMethod: "fadeOut"  
        };

        $.ajax({                                                  //调用jquery的ajax方法   
          type: "POST",                                      //设置ajax方法提交数据的形式   
          url: "sqzz",                                        
          data: {
                  cha : $("#cha").val(),
                  use : $("#use").val()
              }, 
          success: function(data){    
          console.log(data);   
          if (data) {
            toastr.success('授权成功');
            // setInterval(function(){
            //   $('.close-btn').click();
            // }, 1000);
            setInterval(function(){
              location.reload(true);
            }, 1000);
          }else{
            toastr.error('授权失败，请重试');
          }
        },
        error: function () {
                alert('AJAX操作失败');
            }
        });   
     }   
    })
</script>
<script>
		$(function(){
			$('.manage').addClass("active");
		});
</script>
</body>
<!-- END BODY -->
</html>
{/block}
